<template>
  <div class="search_form">
    <div class="logo"><img src="./assets/weather/img/logo.png" alt="logo" /></div>
    <div class="form_group">
      <input type="text" class="input_txt" placeholder="请输入查询的天气"/>
      <button class="input_sub" @click="">
        搜 索
      </button>
    </div>
    <div class="hotkey">
      <a href="javascript:;">北京</a>
      <a href="javascript:;">上海</a>
      <a href="javascript:;">广州</a>
      <a href="javascript:;">深圳</a>
    </div>
  </div>
  <ul class="weather_list">
    <li :style="{transitionDelay:index*100+'ms'}">
      <div class="info_type">
          <span class="iconfont" style="font-size: 24px;"></span>
      </div>
      <div class="info_temp">
        <b>低：</b>
        ~
        <b>高：</b>
      </div>
      <div class="info_date"><span></span></div>
    </li>
  </ul>
</template>
  
<script>

  export default {
    data(){
      return {
        city:'无锡',
        hotkeys:[],
        weatherList:[]
      }
    },
    methods:{
      //搜索天气
      /*
        请求地址:http://gfeljm.tianqiapi.com/api?version=v9&appid=xxxx&appsecret=xxxx
        请求方法:get
        请求参数:city(城市名)
        响应内容:天气信息
      */
      
    }
  }
</script>
  
<style lang="less">
  @import url("./assets/weather/css/reset.css");
  @import url("./assets/weather/css/index.css");
</style>
  